﻿//MusicListView.qml

import QtQuick 2.1
import QtQuick.Shapes 1.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import QtQml 2.15

Frame{

    property var musiclist: []
    property int all: 0
    property int pageSize: 60
    property int current:0

    property bool deleteble: true
    property bool favoritable: true
    signal loadMore(int offset,int current)



    signal deleteItem(int index)

    onMusiclistChanged: {
        listViewModel.clear()
        listViewModel.append(musiclist)
    }
    Layout.fillHeight: true
    Layout.fillWidth: true
    clip: true
    padding: 0
    background: Rectangle{
        color:"#00000000"
    }

    ListView{
        id:listView
        anchors.fill: parent
        anchors.bottomMargin: 70
        model:ListModel{
            id:listViewModel
        }
        delegate: listViewdelegate
        ScrollBar.vertical: ScrollBar{
            anchors.right: parent.right
        }
        header: listViewHeader
        highlight: Rectangle{
            color:"#20f0f0f0"
        }
        highlightMoveDuration: 0
        highlightResizeDuration: 0
    }

    Component{
        id:listViewdelegate
        Rectangle{
            id:listViewdelegateItem
            height: 45
            width: listView.width
            color:"#00000000"
            Shape{
                anchors.fill: parent
                ShapePath{
                    strokeWidth: 0
                    strokeColor: "#50000000"
                    strokeStyle: ShapePath.SolidLine
                    startX: 0
                    startY: 45
                    PathLine{
                        x:0
                        y:45
                    }
                    PathLine{
                        x:600
                        y:45
                    }
                }
            }

            MouseArea{
                RowLayout{
                    width:parent.width
                    height: parent.height
                    spacing: 15
                    x:5
                    Text{
                        text: index+1+pageSize*current
                        horizontalAlignment: Qt.AlignHCenter
                        Layout.preferredWidth: parent.width*0.05
                        font.family: window.mFONT_FAMILY
                        color: "#eeffffff"
                        elide:Qt.ElideRight
                    }
                    Text{
                        text: name
                        horizontalAlignment: Qt.AlignHCenter
                        Layout.preferredWidth: parent.width*0.4
                        font.family: window.mFONT_FAMILY
                        color: "#eeffffff"
                        elide:Qt.ElideRight
                    }
                    Text{
                        text: artist
                        horizontalAlignment: Qt.AlignHCenter
                        Layout.preferredWidth: parent.width*0.15
                        font.family: window.mFONT_FAMILY
                        color: "#eeffffff"
                        elide:Qt.ElideRight
                    }
                    Text{
                        text: album
                        horizontalAlignment: Qt.AlignHCenter
                        Layout.preferredWidth: parent.width*0.15
                        font.family: window.mFONT_FAMILY
                        color: "#eeffffff"
                        elide:Qt.ElideRight
                    }
                    Item{
                        LayoutBottomView{
                            visible: false
                            id:layoutbottomView
                        }

                        Layout.preferredWidth: parent.width*0.15
                        RowLayout{
                            anchors.centerIn: parent
                            MusicIconButton{
                                iconSource: "qrc:/images/pause"
                                iconHeight: 16
                                iconWidth: 16
                                toolTip: "播放"
                                onClicked:{
                                    layoutBottomView.current = -1
                                    layoutBottomView.playList = musiclist
                                    layoutBottomView.current = index
                                }

                            }
                            MusicIconButton{
                                visible: favoritable
                                iconSource: "qrc:/images/favorite"
                                iconHeight: 16
                                iconWidth: 16
                                toolTip: "喜欢"
                                onClicked: {
                                    //喜欢
                                layoutBottomView.saveFavorite({
                                                            id:musiclist[index].id,
                                                            name:musiclist[index].name,
                                                            artist:musiclist[index].artist,
                                                            url:musiclist[index].url?musiclist[index].url:"",
                                                            album:musiclist[index].album,
                                                            type:musiclist[index].type?musiclist[index].type:""
                                                              })
                               // console.log("喜欢id...",musiclist[index].id)
                                }
                            }
                            MusicIconButton{
                                visible: deleteble
                                iconSource: "qrc:/images/clear"
                                iconHeight: 16
                                iconWidth: 16
                                toolTip: "删除"
                                onClicked: {
                                    //删除
                                    deleteItem(index)
                                }
                            }
                        }
                    }

                }

                anchors.fill: parent
                hoverEnabled: true

                cursorShape: Qt.PointingHandCursor


                onEntered: {
                    color="#20f0f0f0"
                }
                onExited: {
                    color="#00000000"
                }

                propagateComposedEvents: true

                onClicked:{
                    listViewdelegateItem.ListView.view.currentIndex = index
                }
            }
        }

    }
    Component{
        id:listViewHeader
        Rectangle{
            color:"#3000AAAA"
            height: 45
            width: listView.width
            RowLayout{
                width:parent.width
                height: parent.height
                spacing: 15
                x:5
                Text{
                    text: "序号"
                    horizontalAlignment: Qt.AlignHCenter
                    Layout.preferredWidth: parent.width*0.05
                    font.family: window.mFONT_FAMILY
                    color: "white"
                    elide:Qt.ElideRight
                }
                Text{
                    text: "歌名"
                    horizontalAlignment: Qt.AlignHCenter
                    Layout.preferredWidth: parent.width*0.4
                    font.family: window.mFONT_FAMILY
                    color: "white"
                    elide:Qt.ElideRight
                }
                Text{
                    text: "歌手"
                    horizontalAlignment: Qt.AlignHCenter
                    Layout.preferredWidth: parent.width*0.15
                    font.family: window.mFONT_FAMILY
                    color: "white"
                    elide:Qt.ElideRight
                }
                Text{
                    text: "专辑"
                    horizontalAlignment: Qt.AlignHCenter
                    Layout.preferredWidth: parent.width*0.15
                    font.family: window.mFONT_FAMILY
                    color: "white"
                    elide:Qt.ElideRight
                }

                Text{
                    text: "操作"
                    horizontalAlignment: Qt.AlignHCenter
                    Layout.preferredWidth: parent.width*0.15
                    font.family: window.mFONT_FAMILY
                    color: "white"
                    elide:Qt.ElideRight
                }
            }
        }
    }
    Item{
        id:pageButton
        visible: musiclist.length !==0&&all!==0
        width:parent.width
        height: 40
        anchors.top:listView.bottom
        anchors.topMargin: 20
        ButtonGroup{
            buttons:buttons.children

        }
        RowLayout{
            id:buttons
            anchors.centerIn: parent
            Repeater{
                id:repeater
                model:all/pageSize>9?9:all/pageSize
                Button{
                    Text{
                        anchors.centerIn: parent
                        text:modelData +1
                        font.family: window.mFONT_FAMILY
                        font.pointSize: 14
                        color:checked?"#497563":"balck"
                    }
                    background: Rectangle{
                        implicitHeight: 30
                        implicitWidth: 30
                        color:checked?"#e2f0f8":"#20e9f4ff"
                        radius: 3
                    }
                    checkable: true
                    checked:modelData === current
                    onClicked: {
                        if(current === index) return
                        current = index
                        loadMore(current*pageSize,index)

                    }

                }
            }
        }

    }
    }

